<template>
  <div>
    <AppLink
      v-bind="$attrs"
      :to="to"
      class="inline-flex items-center px-1 pt-1 border-b-2 border-transparent text-sm font-medium leading-5 text-gray-500 hover:text-gray-700 hover:border-gray-300 focus:outline-none focus:text-gray-700 focus:border-gray-300 transition duration-150 ease-in-out"
      active-class="border-indigo-500 text-gray-900 focus:border-indigo-700"
      inactive-class="text-gray-500 hover:text-gray-700 hover:border-gray-300 focus:text-gray-700 focus:border-gray-300"
    >
      <slot />
    </AppLink>
  </div>
</template>
<script>
import AppLink from "./AppLink.vue";
export default {
  components: {
    AppLink,
  },
  data() {
    return {
      to: "/ScrollBehavior",
    };
  },
};
</script>
